<template>
	<view>
		<view class="bg_image">
			<!-- 头像 -->
			<view class="header_border">
				<image v-if="info.avatar" :src="info.avatar"></image>
				<!-- <image v-else src="../../pagesSub/static/images/icon_head@2x.png"></image> -->
			</view>
			<!-- 就诊人信息 -->
			<view class="doctor_info">
				<view>
					<text v-if="isLogin" class="name">{{ info.patientName }}</text>

					<text v-else class="name" @click="gotoUrl('/pagesSub/index/index')">
						请登录
					</text>
					<view class="checkdata">

						<text @click="editor">编辑就诊人</text>
						<text style="padding-left: 10rpx;padding-right: 20rpx;">ꓲ</text>
						<text>积分</text>
						<text style="padding-left: 10rpx;color: #ffe8a6;">{{points}}</text>


					</view>
				</view>
				<view>
					<!--						<text @click="gotoUrl('/pagesSub/my/messageCenter')" class="editorPersonal">消息</text>-->
					<view @click="gotoUrl('/pagesSub-My/my/messageCenter')" class="FAQ">
						<image style="width: 30%; height: 95%; left: 14rpx; position: absolute;"
							src="../../static/images/message@2x11.png"></image>
						<text style="margin-right: 20rpx;">消息</text>
					</view>
				</view>
				<!--					<view>-->
				<!--						<text @click="gotoUrl('/pagesSub-My/my/messageCenter')" class="editorPersonal">消息</text>-->
				<!--						<view @click="FAQ" class="FAQ">FAQ</view>-->
				<!--					</view>-->
			</view>
		</view>
		<!-- 医生信息 -->
		<view class="record_content">
			<view v-if="info.doctorName && info.type == 1"
				style="width: 100%; display: flex; justify-content: space-between;">
				<view style="display: flex; " class="doctorInfo">
					<view>
						<image class="doctor_header" v-if="info.doctorImg" :src="info.doctorImg"></image>
						<image class="doctor_header" v-else src="../../static/images/icon_head@2x.png"></image>
					</view>

					<view class="record_info">
						<view class="line1Overflow">
							<text style="font-size: 32rpx; font-weight: bold;">
								{{ info.doctorName ? info.doctorName : '' }}

							</text>
							<text style="margin: 0 15rpx;">
								{{ info.deptName ? info.deptName : '' }}
							</text>
							<!-- <text style="padding: 0 5rpx;" v-if="info.deptName">|</text> -->
							<text>{{ info.jobTitle ? info.jobTitle : '' }}</text>
						</view>
						<view class="line1Overflow" style="width: 410rpx;">
							<text style="font-size: 29rpx;">
								{{ info.hospitalName ? info.hospitalName : '' }}
							</text>
						</view>
					</view>
				</view>

				<view v-if="isBarTitle" class="btn_small" style="margin-top: 25rpx;"
					@click="goto('/pages/homePage/doctorPage')">
					去咨询
				</view>
			</view>
			<view v-else-if="info.doctorName && info.type == 5"
				style="width: 100%; display: flex; justify-content: space-between;">
				<view style="display: flex" class="doctorInfo">
					<view>
						<image class="doctor_header" v-if="info.storeLogo" :src="info.storeLogo"></image>
						<image class="doctor_header" v-else src="../../static/images/icon_head@2x.png"></image>
					</view>

					<view class="record_info">
						<view class="line1Overflow">
							<text style="font-size: 32rpx; font-weight: bold;">
								{{ info.doctorName ? info.doctorName : '' }}
							</text>
							<text style="margin: 0 15rpx;">
								{{ info.storePhone ? info.storePhone : '' }}
							</text>
							<!-- <text style="padding: 0 5rpx;" v-if="info.deptName">|</text> -->
							<!--                <text>{{info.jobTitle?info.jobTitle:''}}</text>-->
						</view>
						<view class="line1Overflow">
							<text style="font-size: 29rpx;">
								{{ info.storeName ? info.storeName : '' }}
							</text>
						</view>
					</view>
				</view>

				<view v-if="isBarTitle" class="btn_small" style="margin-top: 25rpx;"
					@click="goto('/pages/homePage/doctorPage')">
					去咨询
				</view>
			</view>
			<view v-else class="noData">
				<view class="gray_font">暂未绑定药店</view>
			</view>
		</view>
		<!-- 药品记录 -->
		<view class="contentCard">
			<view class="recordTitle">
				<view style="display: flex;">
					<view class="icon_line_green"></view>
					<view class="title">商品订单</view>
				</view>

				<view style="display: flex;" @click="goto(`/pages/my/drugOrderList`)">
					<view style="line-height: 50rpx;" class="all_record gray_font">
						全部订单
					</view>
					<view style="height: 50rpx; line-height: 50rpx;">
						<image style="width: 40rpx; height: 30rpx; margin-top: 12rpx;"
							src="../../static/images/icon_gray.png"></image>
					</view>
				</view>
			</view>
			<view class="green_line_all">
				<view class="green_title" @click="goto(`/pages/my/drugOrderList?status=1`)">
					<uni-badge class="uni-badge-left-margin" :text="order.noPay" absolute="rightTop" size="small"
						type="error">

						<image src="../../static/images/icon_h_yfu@2x.png"></image>
					</uni-badge>
					<view>待付款</view>
				</view>
				<view class="green_title" @click="goto(`/pages/my/drugOrderList?status=2`)">
					<uni-badge class="uni-badge-left-margin" :text="order.progress" absolute="rightTop" size="small"
						type="error">
						<image src="../../static/images/icon_h_yjin@2x.png"></image>
					</uni-badge>
					<view>进行中</view>
				</view>
				<view class="green_title" @click="goto(`/pages/my/drugOrderList?status=3`)">
					<uni-badge class="uni-badge-left-margin" :text="order.finish" absolute="rightTop" size="small"
						type="error">
						<image src="../../static/images/icon_h_ywan@2x.png"></image>
					</uni-badge>
					<view>已完成</view>
				</view>
				<view class="green_title" @click="goto(`/pages/my/drugOrderList?status=4`)">
					<uni-badge class="uni-badge-left-margin" :text="order.closure" absolute="rightTop" size="small"
						type="error">
						<image src="../../static/images/icon_h_yclose@2x.png"></image>
					</uni-badge>
					<view>已关闭</view>
				</view>
			</view>
			<view class="logistics" v-if="info.lastOrderResponseBody">
				<view style="display: flex; width: 75%;">
					<view class="medicalImg">
						<image src=""></image>
					</view>
					<view class="medicalInfo">
						<view>{{ info.lastOrderResponseBody.orderName }}</view>
						<view class="gray_font" style="font-size: 25rpx; margin-top: 5rpx;">
							{{
                info.lastOrderResponseBody.orderStaus == 2 ? '待发货' : '已发货'
              }}
						</view>
					</view>
				</view>

				<view class="gray_font" style="font-size: 25rpx; margin-top: 5rpx; width: 25%;">
					{{ info.lastOrderResponseBody.createTime }}
				</view>
			</view>
		</view>
		<view class="contentCard" style="margin-top: 20rpx;">
			<view class="recordTitle">
				<view style="display: flex;">
					<view class="icon_line_green"></view>
					<view class="title">健康服务</view>
				</view>
			</view>
			<view class="green_line_all" style="width: 75%;">
				<view class="green_title" @click="goto(`/pagesSub-My/my/doctorList`)">
					<image src="../../static/images/icon_h_jyi@2x.png"></image>
					<view>我关注的药店</view>
				</view>
				<!-- <view class="green_title" @click="goto(`/pagesSub-My/my/inquiryList`)">
                    <image src="../../static/images/icon_h_jzhen@2x.png"></image>
                    <view>我的问诊</view>
                </view> -->
				<view class="green_title" @click="goto(`/pagesSub-My/my/userInfo`)">
					<image src="../../static/images/icon_h_jj@2x.png"></image>
					<view>健康档案</view>
				</view>
				<!--					<view class="green_title" @click="goto(`/pages/my/orderDetails?orderId=1`)">-->
				<!--						<image src="../../pagesSub/static/images/icon_h_jj@2x.png"></image>-->
				<!--						<view>物流详情</view>-->
				<!--					</view>-->
			</view>
		</view>
		<view class="contentCard" style="margin-top: 20rpx;">
			<view class="recordTitle">
				<view style="display: flex;">
					<view class="icon_line_green"></view>
					<view class="title">我的工具</view>
				</view>
			</view>
			<view class="green_line_all">
				<view class="green_title" @click="gotoUrl('/pagesSub-My/active/records')">
					<image src="../../static/images/select_active_nav1.png"></image>
					<view>优惠券</view>
				</view>
				<view class="green_title" @click="gotoUrl('/pagesSub-My/my/addressList')">
					<image src="../../static/images/icon_h_jd@2x.png"></image>
					<view>我的地址</view>
				</view>
				<view class="green_title" @click="gotoUrl('/pagesSub-My/my/customerService')">
					<image src="../../static/images/icon_h_jke@2x.png"></image>
					<view>联系客服</view>
				</view>
				<view class="green_title" @click="gotoUrl('/pagesSub-My/my/agreement')">
					<image src="../../static/images/icon_h_jfu@2x.png"></image>
					<view>服务协议</view>
				</view>
				<view class="green_title" @click="FAQ">
					<image src="../../static/images/icon_faq@2x.png"></image>
					<view>FAQ</view>
				</view>
			</view>
		</view>


		<!-- <button type="default" @click="gotoThree">跳转第三方</button> -->
		<!-- <view slot="body" class="box" style="line-height:50rpx ;">
			    <view class="box-top">
			        <view class="box-img">
			            <image class="uni-media-list-logo" style="width: 60rpx;height: 60rpx;" :src="info.doctorImg"></image>
			            <view  class="box-name" >{{ info.patientName }} </view>

			        </view>
			    </view>
			    <view class="box-bottom">
			        <view class="box-img">
			        <image class="uni-media-list-logo" style="width: 60rpx;height: 60rpx;" :src="info.doctorImg"></image>
			        <view  class="box-name" >{{ info.doctorName }} </view>
			            <view  class="box-name" >{{ info.hospitalName }} </view>
			        </view>
			    </view>
			    <view>
			        <view>
			            <view  class="box-name" >药品记录 </view>
			            <uni-badge class="uni-badge-left-margin" :text="info.pendingPay" absolute="rightTop" size="small" style="margin-top: 50rpx" type="primary">
			                <view class="box" @click="goto(`/pages/my/drugOrderList?status=1`)">
			                    <text class="box-text">待付款</text>
			                </view>
			            </uni-badge>
			            <uni-badge class="uni-badge-left-margin" :text="info.conduct" absolute="rightTop" size="small" style="margin-top: 50rpx" type="primary">
			                <view class="box" @click="goto(`/pages/my/drugOrderList?status=2`)">
			                    <text class="box-text">进行中</text>
			                </view>
			            </uni-badge>
			            <uni-badge class="uni-badge-left-margin" :text="info.finish" absolute="rightTop" size="small" style="margin-top: 50rpx" type="primary">
			                <view class="box" @click="goto(`/pages/my/drugOrderList?status=3`)">
			                    <text class="box-text">已完成</text>
			                </view>
			            </uni-badge>
			            <uni-badge class="uni-badge-left-margin" :text="info.closure" absolute="rightTop" size="small" style="margin-top: 50rpx" type="primary">
			                <view class="box" @click="goto(`/pages/my/drugOrderList?status=4`)">
			                    <text class="box-text">已关闭</text>
			                </view>
			            </uni-badge>
			        </view>
			        <view>
			            <view class="box-img">
			                <view  class="box-name" >订单名称：{{ deliverystatus[info.lastOrderResponseBody.orderName] }} </view>
			                <image class="uni-media-list-logo" style="width: 60rpx;height: 60rpx;" :src="info.drugImg"></image>
			                <view  class="box-name" >快递状态：{{ deliverystatus[info.lastOrderResponseBody.orderStaus] }} </view>
			                <view  class="box-name" >时间：{{ info.lastOrderResponseBody.createTime }} </view>
			            </view>
			        </view>
			    </view>

			    <view class="">
			        我的
			       <button type="default" @click="gotoUrl('/pages/my/addPatients')">添加就诊人</button>
			       <button type="default" @click="gotoUrl('/pages/my/toBuyMedicine')">去购药</button>
			       <button type="default" @click="gotoUrl('/pages/my/userInfo')">患者详情</button>
			       <button type="default" @click="gotoUrl('/pages/my/addressList')">地址</button>
			       <button type="default" @click="gotoUrl('/pagesSub-My/my/customerService')">客服</button>
			       <button type="default" @click="gotoUrl('/pages/my/inquiryList')">我的问诊</button>
			       <button type="default" @click="gotoUrl('/pages/my/drugOrderList')">我的药品</button>
			       <button type="default" @click="gotoUrl('/pages/my/doctorList')">我的医生</button>
			    </view>
			</view> -->
		<!-- <button type="default" @click="gotoUrl('/pages/my/toBuyMedicine?id=155&orderType=4')">去购药</button> -->
		<!-- <button type="default" @click="gotoUrl('/pagesSub/shopCar/index')">购物车</button> -->
		<!-- <text class="title" @click="gotoUrl('/pagesSub/index/index')">去授权登录/支付</text> -->
		<!-- <button @click="gotoUrl('/pagesSub-My/my/orderDetails')">物流详情</button> -->
	</view>
</template>

<script>
	import {
		userInfo,
		orderStatusInfo
	} from '@/api/user.js'
	import store from '@/store'
	export default {
		data() {
			return {
				isBarTitle: true,
				points: '',
				info: {},
				order: {},
				//改字典接口
				deliverystatus: {
					2: '待发货',
					3: '已发货',
				},
				isLogin: false,
			}
		},
		onShow() {
			this.isLogin = this.$store.getters.isLogin
			console.log('---------------'+this.$store.getters.isLogin);
			if (this.$store.getters.isLogin) {
				this.getUserInfo()
				this.getOrderStatusInfo()
			}
			this.setBarTitle(this.$store.state.app.flag);
		},
		onLoad() {
			// this.getUserInfo();
			// this.getOrderStatusInfo();
		},
		onPullDownRefresh() {
			// console.log('refresh');
			this.isLogin = this.$store.getters.isLogin
			if (this.$store.getters.isLogin) {
				this.getUserInfo()
				this.getOrderStatusInfo()
			}
			setTimeout(function() {
				uni.stopPullDownRefresh()
			}, 1000)
		},
		onTabItemTap(e) {
			if (this.$store.getters.isLogin) {
				this.getUserInfo()
			}
		},
		methods: {
			setBarTitle(expressFlag) {

				if (expressFlag === '1') {

					this.isBarTitle = false


				} else {
					this.isBarTitle = true

				}

			},
			gotoThree() {
				wx.navigateToMiniProgram({
						appId: 'wxe9ad2ec23f63e83b', //第三方小程序的appid
						path: 'pages/index/index',
						extraData: {
							tradeno: 'MPC2022030900432613JNSYBJ', // res.tradeno, //'MPC20200403111232001',
							dyfid: '1636536657354uc3zOLMMCK9dIksQB',
							ydbh: '012961',
						},
						envVersion: 'release', // develop:开发版，trial体验版，release正式版
					})
					.catch((err) => {
						uni.showToast({
							title: err,
							icon: 'none',
							duration: 3000,
						})
					})
			},
			goto(url) {
				if (this.$store.getters.isLogin) {
					uni.navigateTo({
						url: url,
					})
				} else {
					uni.navigateTo({
						url: '/pagesSub/index/index',
					})
				}
			},
			gotoUrl(url) {
				if (this.$store.getters.isLogin) {
					uni.navigateTo({
						url: url,
					})
				} else {
					uni.navigateTo({
						url: '/pagesSub/index/index',
					})
				}
				// uni.navigateTo({
				//     url:url
				// })
			},
			getUserInfo() {
				let serviceUidCache = store.state.app.serviceUid || 0
				console.log(serviceUidCache)
				userInfo(serviceUidCache)
					.then((res) => {
						this.info = res.data

						this.points = res.data.points;
						this.$store.commit('SET_USER_PHOTO', res.data.avatar) //存一下用户头像
						// console.log(this.info, '获取省err')
					})
					.catch((err) => {
						// console.log(err, '获取省err')
						this.$util.Tips({
							title: err,
							icon: 'none'
						})
					})
			},
			getOrderStatusInfo() {
				orderStatusInfo()
					.then((res) => {
						this.order = res.data
						// console.log(this.order, '记录')
					})
					.catch((err) => {
						this.$util.Tips({
							title: err,
							icon: 'none'
						})
						// console.log(err, '获取省err')
					})
			},
			editor() {
				this.goto('/pagesSub/homePage/prescribing/addPeople')
				// uni.navigateTo({
				// 	url:"/pages/homePage/prescribing/addPeople"
				// })
			},
			FAQ() {
				this.goto('/pagesSub-My/my/faqList')
				// uni.navigateTo({
				// 	url:"/pagesSub-My/my/faqList"
				// })
			},
		},
	}
</script>

<style>
	.box {
		width: 100%;
	}

	.box-top {
		width: 100%;
		display: inline-flex;
	}

	.box-img {
		display: inline-flex;
	}

	image {
		border-radius: 50%;
	}

	.box-name {
		float: left;
		line-height: 60rpx;
		padding: 0 18rpx;
		font-weight: 600;
		opacity: 0.8;
		font-size: 30rpx;
	}

	.box-bottom {
		background-color: #f5f5f5;
		padding: 14rpx 24rpx;
		border-radius: 8rpx;
	}

	.text {
		font-size: 13px;
		opacity: 0.85;
	}

	/* 样式 */
	.bg_image {
		background-image: url(../../static/images/bg_h_doc@2x.png);
		width: 100%;
		height: 320rpx;
		background-size: 100% 100%;
		color: #ffffff;
		position: relative;
	}

	.header_border {
		position: absolute;
		top: 130rpx;
		left: 30rpx;
		border-radius: 100%;
		background-color: #ffffff;
		width: 130rpx;
		height: 130rpx;
	}

	.header_border image {
		width: 100%;
		height: 100%;
		border-radius: 100%;
	}

	.doctor_info {
		position: absolute;
		top: 138rpx;
		left: 180rpx;
		color: #ffffff;
		display: flex;
		justify-content: space-between;
		width: 540rpx;
	}

	.name {
		font-size: 36rpx;
	}

	.post {
		color: #e6ecfe;
		margin-left: 20rpx;
		font-size: 28rpx;
	}

	.checkdata {
		font-size: 30rpx;
		margin-top: 10rpx;
		color: #e3fafb;
	}

	.editorPersonal {
		font-size: 29rpx;
		float: right;
	}

	.FAQ {
		background-color: #ffffff;
		border-top-left-radius: 40rpx;
		border-bottom-left-radius: 40rpx;
		color: #62c0ad;
		height: 45rpx;
		line-height: 45rpx;
		margin-top: 60rpx;
		text-align: right;
		font-size: 32rpx;
		width: 150rpx;
		position: absolute;
		right: 0;
		font-weight: bold;
	}

	.record_content {
		display: flex;
		padding: 20rpx 20rpx;
		background-color: #ffffff;
		position: absolute;
		left: 30rpx;
		right: 30rpx;
		top: 280rpx;
		border-radius: 10rpx;
	}

	.doctor_header {
		border-radius: 100%;
		background-color: #ffffff;
		width: 90rpx;
		height: 90rpx;
	}

	.doctorInfo {
		width: 78%;
		overflow: auto;
	}

	.record_info {
		margin-left: 20rpx;
		font-size: 30rpx;
		margin-top: 10rpx;

	}

	.btn_small {
		font-size: 27rpx;
		color: #ffffff;
		width: 110rpx;
		text-align: center;
		border-radius: 40rpx;
		background: -webkit-linear-gradient(#77e2a4, #4ccdbc);
		height: 50rpx;
		line-height: 50rpx;
	}

	.contentCard {
		position: relative;
		padding: 20rpx 20rpx;
		background-color: #ffffff;
		border-radius: 10rpx;
		margin: 0 30rpx;
		margin-top: 110rpx;
		margin-bottom: 20rpx;
	}

	.recordTitle {
		display: flex;
		justify-content: space-between;
	}

	.title {
		font-size: 35rpx;
		font-weight: bold;
		letter-spacing: 3rpx;
	}

	.all_record {
		font-size: 27rpx;
	}

	.icon_line_green {
		height: 35rpx;
		padding: 4rpx;
		border-top-right-radius: 40rpx;
		border-bottom-right-radius: 40rpx;
		background-color: #0cb56a;
		position: absolute;
		left: 0;
	}

	.green_line_all {
		display: flex;
		justify-content: space-around;
		margin-top: 30rpx;
	}

	.green_title {
		text-align: center;
		font-size: 30rpx;
	}

	.green_title image {
		width: 70rpx;
		height: 70rpx;
	}

	.logistics {
		display: flex;
		font-size: 30rpx;
		background-color: #f6f4f5;
		padding: 10rpx;
		border-radius: 10rpx;
		margin-top: 20rpx;
	}

	.medicalImg {
		background-color: #ffffff;
		border-radius: 10rpx;
		width: 110rpx;
		height: 90rpx;
	}

	.medicalInfo {
		margin-left: 15rpx;
		margin-top: 5rpx;
	}

	.noData {
		font-size: 33rpx;
		text-align: center;
	}

	.noData view {
		width: 650rpx;
		height: 100rpx;
		line-height: 100rpx;
	}
</style>